import 'package:earn_money/pages/login_page.dart';
import 'package:flutter/material.dart';
import 'package:dots_indicator/dots_indicator.dart';

class IntroductionPage extends StatefulWidget {
  
  const IntroductionPage({super.key});


  @override
  State<IntroductionPage> createState() => _IntroductionPageState();
}

class _IntroductionPageState extends State<IntroductionPage> {
  final PageController _pageController = PageController(initialPage: 0);
  int _currentPageIndex = 0;
  final List<String> _pageTexts = [
    'Page 1',
    'Page 2',
    'Page 3',
    'Page 4',
  ];
  final List<String> _pageImages = [
    '1.jpg',
    '2.jpg',
    '1.jpg',
    '2.jpg',
  ];

  @override
  void dispose() {
    _pageController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: [
          Container(
            color: Colors.transparent, // Set the color to transparent
            padding: const EdgeInsets.fromLTRB(16, 100, 16, 16), // Add top padding of 100
            child: const Text(
              'RichRush',
              style: TextStyle(
                color: Colors.black, // Set the text color to black
                fontSize: 32,
                fontWeight: FontWeight.bold,
              ),
            ),
          ),
          Expanded(
            child: PageView.builder(
              controller: _pageController,
              itemCount: _pageTexts.length + 1,
              onPageChanged: (index) {
                setState(() {
                  _currentPageIndex = index;
                });
              },
              itemBuilder: (context, index) {

                if (index == _pageTexts.length) {
                  return const UsageWidget();
                }
                return Center(
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      Image.network(
                        'http://192.168.1.185/${_pageImages[index]}',
                        width: 200,
                        height: 200,
                      ),
                      const SizedBox(height: 20),
                      Text(
                        _pageTexts[index],
                        style: const TextStyle(fontSize: 24),
                      ),
                    ],
                  ),
                );
              },
            ),
          ),
          const SizedBox(height: 20),
          DotsIndicator(
            dotsCount: _pageTexts.length + 1,
            position: _currentPageIndex.toDouble(),
            decorator: DotsDecorator(
              activeColor: Colors.blue,
              activeSize: const Size(12, 12),
              activeShape: RoundedRectangleBorder(
                borderRadius: BorderRadius.circular(6),
              ),
            ),
          ),
          const SizedBox(height: 20),
          ElevatedButton(
            onPressed: () {
              setState(() {
                if (_currentPageIndex < _pageTexts.length ) {
                  _currentPageIndex++;
                  _pageController.animateToPage(
                    _currentPageIndex,
                    duration: const Duration(milliseconds: 300),
                    curve: Curves.easeInOut,
                  );
                } else {
                  // Handle finish button action
                  setState(() {
                    Navigator.push(
                      context, 
                      MaterialPageRoute(builder: (context) => const LoginPage()));
                  });
                }
              });
            },
            child: Text(
              _currentPageIndex < _pageTexts.length  ? 'Next' : 'Finish',
            ),
          ),
          const SizedBox(height: 20),
        ],
      ),
    );
  }
}

class UsageWidget extends StatefulWidget {
  const UsageWidget({super.key});

  @override
  State<UsageWidget> createState() => _UsageWidgetSate();
}

class _UsageWidgetSate extends State<UsageWidget> {

  var _state = false;


  @override
  Widget build(BuildContext context) {
      return Column(
        children: [
          const Text(
            'Allow app to track your usage date to enable your earning protection.',
             style: TextStyle(
              fontSize: 18,
              fontWeight: FontWeight.bold,
            ),
            textAlign: TextAlign.center,
          ),
          Container(
            margin: const EdgeInsets.all(16),
            padding: const EdgeInsets.all(16),
            decoration: BoxDecoration(
              color: Colors.white,
              borderRadius: BorderRadius.circular(10),
              boxShadow: [
                BoxShadow(
                  color: Colors.grey.withOpacity(0.5),
                  spreadRadius: 2,
                  blurRadius: 5,
                  offset: const Offset(0, 3),
                ),
              ],
            ),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Row(
                  children: [
                    const Text(
                      'Permit Usage Access',
                      style: TextStyle(
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                    const Spacer(),
                    Switch(
                      value: _state,
                      onChanged:(value){
                        // Handle switch action
                        setState(() {
                          _state = value;
                        });
                      },
                    ),
                  ],
                ),
                const SizedBox(height: 10),
                const Text(
                  'This is a multi-line text that serves as an introduction.',
                  style: TextStyle(
                    color: Colors.grey,
                  ),
                ),
              ],
            ),
          )],
      ) 
        ;
  }
  
}



